// 自定义插件和全局指定 阔以use是因为内部通过install的方法对于进一步封装
import PageTools from '@/components/PageTools'
import UploadExcel from '@/components/UploadExcel'
import AddEmployee from '@/components/AddEmployee'
import ImageUpload from '@/components/ImageUpload'
// 导入全局指令 moment
import moment from 'moment'
export default {
  install(Vue, options) {
    //  在这也阔以注册全局的组件
    //  借助Vue注册全局指令
    Vue.directive('imgerror', {
      inserted(el, bindings) {
        // 前一个参数是指令所在的元素 第二个就是元素给所在指令的所有信息
        // console.log(bindings.value) v-imgerror="defaultImg"这个属性解析的时候是变量的形式哈 后面就是所赋值的那个变量
        el.onerror = () => { // 当所在标签出错就会触发这个方法吧
          // 在这就是就给所在标重新给默认
          // 当前面有默认的先给默认的地址没有默认地址就给全局use传给的install()的第二个参数阔以是对象seAttribte('自定义的属性名', '自定义属性值')
          el.setAttribute('src', bindings.value || options.default)
        }
      },
      // 如果当图片得src属性值是null 的时候就不会触发onerror函数
      // componentUpdated () {} 就是当绑定标签依耐数据发生改变时触发的
      componentUpdated(el, bindings) {
        // 当绑定标签的属性有值 就原地取值 没有往后取值 得到指令后面的属性值 在往后取到全局指令use()传进来的数据哈
        el.setAttribute('src', el.src || bindings.value || options.default)
      }
    })
    // 注册全局组件 (全局组件注册使用naem不能加引号)
    Vue.component(PageTools.name, PageTools)
    // 处理表格数据的全局组件
    Vue.component(UploadExcel.name, UploadExcel)
    // 注册添加员工全局组件
    Vue.component(AddEmployee.name, AddEmployee)
    // 注册全局上传头像照片
    Vue.component(ImageUpload.name, ImageUpload)
    // 注册全局的过滤器
    Vue.filter('formatTime', (value) => { // 相当于是流向 必须通过,过滤才能将值写到下面
      return moment(value).format('yyyy-DD-MM')
    })
  }
}
